<template>
  <!-- 全局组件
    在组件中，读入excel成功之后，就会执行handleSuccess
   -->
  <upload-excel :on-success="handleSuccess" />
</template>

<script>
import { formatExcelDate } from '@/utils' // 处理日期格式
import { importEmployee } from '@/api/employees'
export default {
  name: 'Import',
  methods: {
    // 导入成功的处理函数
    async handleSuccess({ header, results }) {
      // header，表头数据 ['姓名', '手机号', "入职日期", "转正日期", ...]
      // results: excel表格的内容
      /**
        [
          {'姓名'：'张三', '手机号': '12345678911', '入职日期': '2021/11/5'},
          {'姓名'：'小李', '手机号': ‘13800000512',  '入职日期': '2020/11/5'},
          ...
        ]
      */
      // 目标结构：
      // [{'username'：'张三', 'mobile': '12345678911', ...}, {'username'：'小李', 'mobile': '‘13800000512', ...}, ...]
      console.log('读出的内容：', header, results)
      const data = this.transExcel(results)
      console.log('处理之后的数据：', header, data)

      // 发请求
      const res = await importEmployee()
      console.log(res)

      // 上传成功之后，回去刚才的页面
      this.$router.back()
    },
    transExcel(results) { // 处理表格数据
      // 策略模式
      const userRelations = {
        '入职日期': 'timeOfEntry',
        '手机号': 'mobile',
        '姓名': 'username',
        '转正日期': 'correctionTime',
        '工号': 'workNumber',
        '部门': 'departmentName',
        '聘用形式': 'formOfEmployment'
      }
      // 将字段key转成英文，时间格式转换
      return results.map(item => {
        const obj = {} // 保存英文名
        // 1. 取出这个对象所有的属性名 ['姓名', '手机号', '入职日期']
        const zhKeys = Object.keys(item) // ['姓名', '手机号', '入职日期']
        // 2. 遍历 这个数组(属性名), 通过中文名去 userRelations 中找对应的英文的名字, 保存值
        zhKeys.forEach(zhKey => {
          const enKey = userRelations[zhKey] // username / mobile / timeOfEntry
          obj[enKey] = item[zhKey] // obj[username] = item['姓名'] = 张三
          // 时间格式转换 timeOfEntry: 44502 => Fri Nov 05 2021 00:00:00 GMT+0800
          if (['correctionTime', 'timeOfEntry'].includes(enKey)) {
            obj[enKey] = new Date(formatExcelDate(item[zhKey]))
          }
        })
        return obj
      })
    }
    // handleSuccess(obj) {
    //   const { header, results } = obj
    //   console.log(header, results)
    // }
  }
}
</script>
